<template>
    <el-container>
        <el-header style="height: 50px;background-color:whitesmoke">
            <span class="title" @click="returnMain()"
                  style="display: inline-block;color: #204693;font-size: 18px;margin-top: 15px;">华为商城</span>
        </el-header>
        <el-container>
            <el-aside width="200px" style="background-color: #ffffff">
                <el-menu :default-openeds="['1']" :unique-opened="true" default-active="1-1">
                    <el-submenu index="1" :collapse="false">
                        <template slot="title"><i class="el-icon-message"></i>个人信息管理</template>
                        <el-menu-item-group title="个人信息管理">
                            <el-menu-item index="1-1" @click="personMessage()">个人信息</el-menu-item>
                            <el-menu-item index="1-2">资料变更</el-menu-item>
                            <el-menu-item index="1-3" @click="order()">订单管理</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                    <el-submenu index="3" :collapse="false">
                        <template slot="title"><i class="el-icon-setting"></i>设置</template>
                        <el-menu-item-group title="设置">
                            <el-menu-item index="3-1" @click="loginOut()">退出登录</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </el-aside>
            <el-container>
                <el-main>
                    <router-view></router-view>
                </el-main>
            </el-container>
        </el-container>
    </el-container>


</template>

<script>
import axios from "axios";

export default {
    data() {
        return {}
    },
    mounted() {
        this.personMessage()
    },
    methods: {
        personMessage() {
            this.$router.replace({name: "personMessage"})
        },
        order() {
            this.$router.replace({name: "order"})
        },
        returnMain(){
            this.$router.replace({name: "MainPage"})
        },
        loginOut() {
            window.sessionStorage.clear()
            this.$router.replace({name: "MainPage"})
        }
    }
};
</script>

<style scoped>
el-header {
    background-color: #B3C0D1;
    color: #333;
    line-height: 60px;
}

el-aside {
    color: #333;
}

.title {
    cursor: pointer;
}
</style>



